<!DOCTYPE html>
<html lang="en"  xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>编辑商品</title>
    <link rel="stylesheet" href="__PEAR__/component/pear/css/pear.css" />
    <script type="text/javascript" charset="utf-8" src="__STATIC__/ueditor/ueditor.config.js"></script>
	<script type="text/javascript" charset="utf-8" src="__STATIC__/ueditor/ueditor.all.js"></script>
	<script type="text/javascript" charset="utf-8" src="__STATIC__/ueditor/lang/zh-cn/zh-cn.js"></script>
    <style>
    #tabbox,#bp_div{display:none;}
    </style>
</head>
<body>
<form class="layui-form" action="">
    <div class="mainBox" id="tabbox">
        <div class="main-container">
            <div class="main-container">
            
	            <div class="layui-tab">
				  <ul class="layui-tab-title">
				    <li class="layui-this">基本信息</li>
				    <li>辅助属性</li>
				    <li>其他价格</li>
				    <li>商品介绍</li>
				    <li>分店价格</li>
				    <li>附加条码</li>
				    <li>供应商价格</li>
				    <li>图片上传</li>
				  </ul>
				  <div class="layui-tab-content">
				    <div class="layui-tab-item layui-show">
				    	{include file="product/edit_basic" /}
				    </div>
				    <div class="layui-tab-item">
				    	{include file="product/edit_access" /}
				    </div>
				    <div class="layui-tab-item">
				    	{include file="product/edit_price" /}
				    </div>
				    <div class="layui-tab-item">
				    	{include file="product/edit_content" /}
				    </div>
				    <div class="layui-tab-item">
				    	{include file="product/edit_branch_price" /}
				    </div>
				    <div class="layui-tab-item">
				    	{include file="product/edit_barcode" /}
				    </div>
				    <div class="layui-tab-item">
				    	{include file="product/edit_saler" /}
				    </div>
				     <div class="layui-tab-item">
				    	{include file="product/edit_images" /}
				    </div>
				  </div>
				</div>
			
                 
        		<input name="id" type="hidden" value="{$one['item_no']}"/>
            </div>
        </div>
    </div>
    <div class="bottom">
        <div class="button-container">
            <button type="submit" class="pear-btn pear-btn-primary pear-btn-sm" lay-submit="" lay-filter="item-save">
                <i class="layui-icon layui-icon-ok"></i>
                提交
            </button>
            <button type="reset" class="pear-btn pear-btn-sm">
                <i class="layui-icon layui-icon-refresh"></i>
                重置
            </button>
        </div>
    </div>
</form>

<script type="text/html" id="branchprice-bar">
		    <a class="pear-btn pear-btn-danger pear-btn-sm" lay-event="remove_branchprice">
			<i class="layui-icon layui-icon-delete"></i></a>
</script>
<script type="text/html" id="saler-bar">
		    <a class="pear-btn pear-btn-danger pear-btn-sm" lay-event="remove_saler">
			<i class="layui-icon layui-icon-delete"></i></a>
</script>
<script type="text/html" id="barcode-bar">
		    <a class="pear-btn pear-btn-danger pear-btn-sm" lay-event="remove_barcode">
			<i class="layui-icon layui-icon-delete"></i></a>
</script>
<script src="__STATIC__/lib/layui/layui.js"></script>
<script src="__PEAR__/component/pear/pear.js"></script>
<script>
var ue = UE.getEditor('editor');
//编辑器加载完毕后执行操作
ue.ready(function() {
	ue.setContent('{$one["content"]|raw}',false);
});

var path="/{$MODULE_NAME}/Product";
var _url="/editPost";
//标记处理中事件
var isAjaxing=false;
//获取分店价格-门店编号，供应商编号
var bp_branch_no='';
var bp_sp_no='';

//绑定图片上传后小图片事件
function bindImgHandler($,layer){
	 //图片上传后删除按钮
    $(document).on("mouseenter mouseleave", ".file-iteme", function(event){
        if(event.type === "mouseenter"){
            //鼠标悬浮
            $(this).children(".info").fadeIn("fast");
            $(this).children(".handle").fadeIn("fast");
            $(this).children(".default-icon").show();
        }else if(event.type === "mouseleave") {
            //鼠标离开
            $(this).children(".info").hide();
            $(this).children(".handle").hide();
            var data=$(this).children(".default-icon").attr("data");
            if(data==null||data!=1){
            	$(this).children(".default-icon").hide();
            }
        }
    });
    
    //图片上传后删除按钮点击事件
    $(document).on("click", ".file-iteme .handle i.layui-icon", function(event){
    	event.stopPropagation();
    	//异步删除图片
    	var item_no=$(this).attr("data-itemno");
    	var photo_id=$(this).attr("data-photoid");
    	var that=$(this);
    	layer.load();
    	
    	$.ajax({
            url:path+"/delPhotos",
            data:{"photo_id":photo_id},
            type:'post',
            success:function(result){
            	layer.closeAll();
                if(result.code){
                	that.parent().parent().remove();
                }else{
                    layer.msg(result.msg,{icon:2,time:1000});
                }
           
            },error:function(result){
            	
            }
        })
    	
    });
    
    //图片上传后点击设置默认图片事件
    $(document).on("click", ".file-iteme", function(event){
    	//异步删除图片
    	var item_no=$(this).attr("data-itemno");
    	var photo_id=$(this).attr("data-photoid");
    	var that=$(this);
    	layer.load();
    	
    	$.ajax({
            url:path+"/setDefaultImg",
            data:{"photo_id":photo_id,"item_no":item_no},
            type:'post',
            success:function(result){
            	layer.closeAll();
                if(result.code){
                	$(".file-iteme").children(".default-icon").attr("data",0).hide();
                	that.children(".default-icon").attr("data",1).show();
                	layer.msg(result.msg);
                }else{
                    layer.msg(result.msg,{icon:2,time:1000});
                }
           
            },error:function(result){
            	
            }
        })
    });
}

//解绑事件
function unbindImgHandler($){
 	$(document).off("mouseenter mouseleave", ".file-iteme");
    
    //图片上传后删除按钮点击事件
    $(document).off("click", ".file-iteme .handle i.layui-icon");
    
    //图片上传后删除按钮点击事件
    $(document).off("click", ".file-iteme img");
}


layui.use(['table','form','jquery','upload', 'element','layer'],function(){
	
	let table = layui.table;
	let form = layui.form;
	let $ = layui.jquery;
	let upload = layui.upload
	let element = layui.element;
	let layer = layui.layer;
	
    //图片上传
    upload.render({
        elem: '#uploader'
        ,url: "/{$MODULE_NAME}/product/upload/item_no/{$one['item_no']}"
        ,multiple: true
        ,before: function(obj){
            layer.msg('图片上传中...', {
                icon: 16,
                shade: 0.01,
                time: 0
            })
        }
        ,done: function(res){
            layer.close(layer.msg());//关闭上传提示窗口
            //解绑事件
            unbindImgHandler($);
            //重新绑定事件
            bindImgHandler($,layer);
            //上传完毕
            $('#uploader-list').append(
                '<div id="" class="file-iteme" data-itemno="'+res.data.item_no+'" data-photoid="'+res.data.photo_id+'">' +
                '<div class="handle"><i class="layui-icon layui-icon-delete" data-itemno="'+res.data.item_no+'" data-photoid="'+res.data.photo_id+'"></i></div>' +
                '<div class="default-icon" data="0"><i class="layui-icon layui-icon-ok"></i></div>' +
                '<img style="width: 100px;height: 100px;" src='+ res.data.path +'>' +
                '<div class="info">' + res.data.filename + '</div>' +
                '</div>'
            );
        }
    });
    
  	//绑定事件
    bindImgHandler($,layer);
   
	//加载完成显示所有标签页
	$("#tabbox").show();
	
	let cols_branchprice = [
							[
								{
									title: '分店编码',
									field: 'branch_no',
									width:160,
									align: 'center'
								},
								{
									title: '分店名称',
									field: 'branch_name',
									align: 'center'
								},
								{
									title: '进货价',
									field: 'price',
									align: 'center'
								},
								{
									title: '零售价',
									field: 'sale_price',
									align: 'center'
								},
								{
									title: '批发价',
									field: 'base_price',
									align: 'center'
								},
								{
									title: '会员价',
									field: 'vip_price',
									align: 'center'
								},
								{
									title: '操作',
									toolbar: '#branchprice-bar',
									align: 'center',
									width: 130
								}
							]
		];
	
	let cols_saler = [
						[
							{
								title: '供应商编码',
								field: 'sp_no',
								width:160,
								align: 'center'
							},
							{
								title: '供应商名称',
								field: 'sp_name',
								align: 'center'
							},
							{
								title: '最高价格',
								field: 'top_price',
								align: 'center'
							},
							{
								title: '最低价格',
								field: 'bottom_price',
								align: 'center'
							},
							{
								title: '最近价格',
								field: 'last_price',
								align: 'center'
							},
							{
								title: '约定价格',
								field: 'appointed_price',
								align: 'center'
							},
							{
								title: '经销方式',
								field: 'sale_way',
								align: 'center'
							},
							{
								title: '操作',
								toolbar: '#saler-bar',
								align: 'center',
								width: 130
							}
						]
	];
	
	let cols_barcode = [
							[
								{
									title: '商品货号',
									field: 'item_no',
									width:160,
									align: 'center'
								},
								{
									title: '商品条形码',
									field: 'item_barcode',
									align: 'center'
								},
								{
									title: '修改日期',
									field: 'modify_date',
									align: 'center'
								},
								{
									title: '操作',
									toolbar: '#barcode-bar',
									align: 'center',
									width: 130
								}
							]
		];
	//分店价格
	table.render({
		elem: '#branchprice-table',
		url: path+'/getAllBranchPrice?item_no={$one.item_no}',
		height: 'full-50',
		page: false,
		cols: cols_branchprice,
		skin: 'line',
		defaultToolbar: []
	});
	
	//附加条码
	table.render({
		elem: '#barcode-table',
		url: path+'/getAllBarcode?item_no={$one.item_no}',
		height: 'full-50',
		page: false,
		cols: cols_barcode,
		skin: 'line',
		defaultToolbar: []
	});
	
	//供应商价格
	table.render({
		elem: '#saler-table',
		url: path+'/getAllSupcust?item_no={$one.item_no}',
		height: 'full-50',
		page: false,
		cols: cols_saler,
		skin: 'line',
		defaultToolbar: []
	});
	

	//分店价格-删除事件
	table.on('tool(branchprice-table)', function(obj) {
		window.remove_branchprice(obj);
		return false;
	});
	
	//附加条码-删除事件
	table.on('tool(barcode-table)', function(obj) {
		window.remove_barcode(obj);
		return false;
	});
	
	//供应商-删除事件
	table.on('tool(saler-table)', function(obj) {
		window.remove_saler(obj);
		return false;
	});
	
	//添加分店价格
	$("#btnAddBranchPrice").click(function(){
		
		layer.open({
			  type: 1,
			  title:'添加分店价格',
			  area: ['550px', '450px'],
			  content: $('#bp_div'),
			  btn: ['确认添加', '取消'],
			  yes: function (index, layero) {
				  	var branch_no=bp_branch_no;
				  	var sp_no=bp_sp_no;
				  	var item_no="{$one['item_no']}";
		            var price = $('#bp_price').val();
		            var sale_price=$('#bp_sale_price').val();
		            var base_price=$('#bp_base_price').val();
		            var vip_price=$('#bp_vip_price').val();
		            if(branch_no==''){
		            	layer.msg("请选择分店编号");
		            	return;
		            }else if(sp_no==''){
		            	layer.msg("请选择供应商");
		            	return;
		            }
		            
		            isAjaxing=true;
		    		
		    		$.ajax({
		                url:path+"/addBranchPrice",
		                data:{	"item_no":item_no,"branch_no":branch_no,
		                		"sp_no":sp_no,"price":price,"sale_price":sale_price,
		                		"base_price":base_price,"vip_price":vip_price
		                	},
		                type:'post',
		                success:function(result){
		                    if(result.code){
		                    	 layer.close(index);
		                        layer.msg(result.msg,{icon:1,time:1000},function(){
		                            table.reload("branchprice-table");
		                        });
		                    }else{
		                        layer.msg(result.msg,{icon:2,time:1000});
		                    }
		                    isAjaxing=false;
		                },error:function(result){
		                	isAjaxing=false;
		                }
		            })
		            
		     }
		});
		
	});
	
	//删除分店价格
	window.remove_branchprice=function(obj){
		layer.confirm('确定要删除该记录?', {
			icon: 3,
			title: '提示'
		}, function(index) {
			layer.close(index);
			let loading = layer.load();
			$.ajax({
				url: path+"/delBranchPrice/id/" + obj.data['id'],
				type: 'get',
				dataType: 'json',
				success: function(result) {
					layer.close(loading);
					if (result.code) {
						layer.msg(result.msg, {
							icon: 1,
							time: 1000
						}, function() {
							table.reload("branchprice-table");
						});
					} else {
						layer.msg(result.msg, {
							icon: 2,
							time: 1000
						});
					}
				}
			})
		});
	}
	
	//添加条形码
	$("#btnAddBarcode").click(function(){
		
		var item_no="{$one['item_no']}";
		var barcode=$("#txtAddBarcode").val();
		if($.trim(barcode)==''){
			layer.msg("请输入条形码");
			return false;
		}
		if(isAjaxing){
			layer.msg("请稍后...");
			return false;
		}
		
		isAjaxing=true;
		
		$.ajax({
            url:path+"/addBarcode",
            data:{"item_no":item_no,"barcode":barcode},
            type:'post',
            success:function(result){
                if(result.code){
                    layer.msg(result.msg,{icon:1,time:1000},function(){
                        table.reload("barcode-table");
                    });
                }else{
                    layer.msg(result.msg,{icon:2,time:1000});
                }
                isAjaxing=false;
            },error:function(result){
            	isAjaxing=false;
            }
        })
        return false;
	})
	
	//删除条形码
	window.remove_barcode=function(obj){
		layer.confirm('确定要删除该条码?', {
			icon: 3,
			title: '提示'
		}, function(index) {
			layer.close(index);
			let loading = layer.load();
			$.ajax({
				url: path+"/delbarcode/item_no/" + obj.data['item_no']+"/barcode/"+obj.data['item_barcode'],
				type: 'get',
				dataType: 'json',
				success: function(result) {
					layer.close(loading);
					if (result.code) {
						layer.msg(result.msg, {
							icon: 1,
							time: 1000
						}, function() {
							table.reload("barcode-table");
						});
					} else {
						layer.msg(result.msg, {
							icon: 2,
							time: 1000
						});
					}
				}
			})
		});
	}
	
	//添加经销商价格
	$("#btnAddSupcust").click(function(){
		
		var item_no="{$one['item_no']}";
		var txtAddSupcustNO=$("#txtAddSupcustNO").val();
		var txtAppointted_price=$("#txtAppointted_price").val();
		if($.trim(txtAddSupcustNO)==''){
			layer.msg("请输入供应商编号");
			return false;
		}
		
		if($.trim(txtAppointted_price)==''||parseFloat(txtAppointted_price)==0){
			layer.msg("请输入约定价格");
			return false;
		}
	
		if(isAjaxing){
			layer.msg("请稍后...");
			return false;
		}
		
		isAjaxing=true;
		
		$.ajax({
            url:path+"/addSupcust",
            data:{"item_no":item_no,"supcust_no":txtAddSupcustNO,"price":txtAppointted_price},
            type:'post',
            success:function(result){
                if(result.code){
                    layer.msg(result.msg,{icon:1,time:1000},function(){
                        table.reload("saler-table");
                    });
                }else{
                    layer.msg(result.msg,{icon:2,time:1000});
                }
                isAjaxing=false;
            },error:function(result){
            	isAjaxing=false;
            }
        })
        return false;
	})
	
	//删除经销商价格
	window.remove_saler=function(obj){
		layer.confirm('确定要删除该记录?', {
			icon: 3,
			title: '提示'
		}, function(index) {
			layer.close(index);
			let loading = layer.load();
			$.ajax({
				url: path+"/delSupcust/item_no/" + obj.data['item_no']+"/supcust_no/"+obj.data['sp_no'],
				type: 'get',
				dataType: 'json',
				success: function(result) {
					layer.close(loading);
					if (result.code) {
						layer.msg(result.msg, {
							icon: 1,
							time: 1000
						}, function() {
							table.reload("saler-table");
						});
					} else {
						layer.msg(result.msg, {
							icon: 2,
							time: 1000
						});
					}
				}
			})
		});
	}
	
	//表单事件
	form.on('select(bp_branch_no)', function(data){
		bp_branch_no=data.value;
	});
	
	form.on('select(bp_sp_no)', function(data){
		bp_sp_no=data.value;
	});

    form.on('submit(item-save)', function(data){
        $.ajax({
            url:path+_url,
            data:JSON.stringify(data.field),
            dataType:'json',
            contentType:'application/json',
            type:'post',
            success:function(result){
                if(result.code){
                    layer.msg(result.msg,{icon:1,time:1000},function(){
                        parent.layer.close(parent.layer.getFrameIndex(window.name));//关闭当前页
                        parent.layui.table.reload("items-table");
                    });
                }else{
                    layer.msg(result.msg,{icon:2,time:1000});
                }
            }
        })
        return false;
    });
})
</script>
<script>
</script>
</body>
</html>